<!-- =======================================================
  * Author: Jéssica Yang
  ======================================================== -->

<template>
  <!--侧边导航栏菜单-->
  <el-menu style="min-height: 100%; overflow-x: hidden; background-image: linear-gradient(to right, #3c99e5, #b1dff6)"
           text-color="#fff"
           active-text-color="#fff"
           :collapse-transition="false"
           :collapse="isCollapse"
           router
  >

    <!--菜单title块-->
    <div style="line-height: 60px; display: flex">
      <!--logo-->
      <img src="../../public/logo.png" alt="" style="width: 60px; position: relative">
      <!--title-->
      <b style="color: white" v-show="logoTextShow">公立医院服务系统</b>
    </div>

    <!--跳转部门管理子页面-->
    <el-menu-item index="/mainpage/departmentlist" v-if="this.$store.state.role">
      <template>
        <i class="el-icon-office-building"></i>
        <span slot="title">部门管理</span>
      </template>
    </el-menu-item>

    <!--跳转用户管理子页面-->
    <el-menu-item index="/mainpage/userlist" v-if="this.$store.state.role">
      <template>
        <i class="el-icon-user-solid"></i>
        <span slot="title">用户管理</span>
      </template>
    </el-menu-item>

    <el-submenu index="3" v-if="this.$store.state.role">
      <template slot="title">
        <i class="el-icon-first-aid-kit"></i>
        <span slot="title">医疗机构管理</span>
      </template>
      <el-menu-item-group style="background-image: linear-gradient(to right, #3c99e5, #b1dff6)">
        <el-menu-item index="/mainpage/hospitallist">医疗机构管理</el-menu-item>
        <el-menu-item index="/mainpage/drNumChart">医生人数统计图</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <!--跳转报表管理子页面-->
    <el-submenu index="4" v-if="this.$store.state.role">
      <template slot="title">
        <i class="el-icon-s-data"></i>
        <span slot="title">报表管理</span>
      </template>
      <el-menu-item-group style="background-image: linear-gradient(to right, #3c99e5, #b1dff6)">
        <!--跳转报表模板管理子页面-->
        <el-menu-item index="/mainpage/templatelist">报表模板管理</el-menu-item>
        <!--跳转用户报表审核子页面-->
        <el-menu-item index="/mainpage/reportlist">用户报表审核</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <!--跳转事务管理子页面-->
    <el-menu-item index="/mainpage/businesslist" v-if="this.$store.state.role">
      <template>
        <i class="el-icon-s-order"></i>
        <span slot="title">用户事务管理</span>
      </template>
    </el-menu-item>

    <!--跳转用户上报报表管理子页面-->
    <el-submenu index="6" v-if = !this.$store.state.role>
      <template slot="title">
        <i class="el-icon-s-check"></i>
        <span slot="title">上报报表</span>
      </template>
      <el-menu-item-group style="background-image: linear-gradient(to right, #3c99e5, #b1dff6)">
        <!--跳转报表填写子页面-->
        <el-menu-item index="/mainpage/userreportlist">报表填写</el-menu-item>
        <!--跳转查看报表审核情况子页面-->
        <el-menu-item index="/mainpage/userreportmanage">报表审核情况</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <!--跳转用户上报事务管理子页面-->
    <el-menu-item index="/mainpage/userbusinesslist" v-if="!this.$store.state.role">
      <template>
        <i class="el-icon-s-data"></i>
        <span slot="title">事务审核情况</span>
      </template>
    </el-menu-item>

    <!--跳转通知子页面-->
    <el-menu-item index="/mainpage/note" v-if=!this.$store.state.role>
      <template>
        <i class="el-icon-message"></i>
        <span slot="title">通知</span>
      </template>
    </el-menu-item>



  </el-menu>
</template>

<script>
export default {
  name: "Aside",
  props:{
    isCollapse: Boolean,
    logoTextShow: Boolean
  }
}
</script>

<style scoped>

</style>